<template>
  <div class="safeCheck-edit">
    <secondTopPanel>
      <div slot='title'>新增安全指标</div>
    </secondTopPanel>
    <evanForm ref="form" class="evan-form" :label-style="{width:'200upx',paddingRight:'20upx'}" :model='formData'>
      <evanFormItem label='下级公司名' prop="cutCompanyName" @click="_openCompanyDownPopup">
        <input class="form-input" v-model="formData.cutCompanyName" disabled type="text" placeholder="请选择">
      </evanFormItem>
      <evanFormItem label='指标' prop="indexTitle" @click="_openIndexPopup">
        <input class="form-input" v-model="formData.indexTitle" disabled type="text" placeholder="请选择">
      </evanFormItem>
      <evanFormItem label='指标项' prop="termTitle" @click="_openIndexTermPopup">
        <input class="form-input" v-model="formData.termTitle" disabled type="text" placeholder="请选择">
      </evanFormItem>
      <evanFormItem label='情况' prop="conditionDes" @click="_openDepindexCutPopup">
        <input class="form-input" v-model="formData.conditionDes" disabled type="text" placeholder="请选择">
      </evanFormItem>
      <evanFormItem label='扣分分值' prop="cutScore">
        <input class="form-input" v-model="formData.cutScore" type="text" placeholder="请输入扣分分值">
      </evanFormItem>
    </evanForm>
    <br>
    <button type="primary" @click="submit">确认新增</button>
    <br>
    <!-- 下级公司名弹出框 -->
    <uni-popup ref="companyDownPopup">
      <ly-tree @node-click='handleCompany' :expandOnClickNode='false' :checkOnClickNode="true" :expandOnCheckNode='false' :checkStrictly='true' :accordion='true' :tree-data="companyDownTree" node-key="id">
      </ly-tree>
    </uni-popup>
    <!-- 指标项弹出框 -->
    <uni-popup ref="indexIdPopup">
      <ly-tree @node-click='handleIndex' :props="indexProps" :expandOnClickNode='false' :checkOnClickNode="true" :expandOnCheckNode='false' :checkStrictly='true' :accordion='true' :tree-data="indexTree" node-key="id">
      </ly-tree>
    </uni-popup>
    <!-- 指标子项弹出框 -->
    <uni-popup ref="indexTermPopup">
      <ly-tree @node-click='handleIndexTerm' :props="indexTermProps" :tree-data="indexTermTree" node-key="id" :expandOnClickNode='false' :checkOnClickNode="true" :expandOnCheckNode='false' :checkStrictly='true' :accordion='true'>
      </ly-tree>
    </uni-popup>
    <!-- 情况项弹出框 -->
    <uni-popup ref="depindexCutPopup">
      <ly-tree @node-click='handleDepindexCutTerm' :props="depindexCutProps" :tree-data="depindexCutTree" node-key="id" :expandOnClickNode='false' :checkOnClickNode="true" :expandOnCheckNode='false' :checkStrictly='true' :accordion='true'>
      </ly-tree>
    </uni-popup>
  </div>
</template>

<script>
import uniDatetimePicker from '@/components/uni-datetime-picker/uni-datetime-picker.vue'
import ccPicker from '@/components/cc-picker/cc-picker.vue'
import LyTree from '@/components/ly-tree/ly-tree.vue'
import { getDeptList, getMyThreeDeptlist } from "@/api/user";
import secondTopPanel from '@/pages/component/top-panel/secondTopPanel.vue'
import evanForm from '@/components/evan-form/evan-form.vue'
import evanFormItem from '@/components/evan-form-item/evan-form-item.vue'
import ImageUpload from "@/pages/component/imageUpload/imageUpload.vue";
import { jobManagerInfoOne } from "@/api/jobManager";
import { selectAssessmendocInfo, indexInfoList, indexTermList, depindexCutList, safetyCheckAdd } from "@/api/safeCheck";

export default {
  name: 'archives-edit',
  components: { secondTopPanel, evanForm, evanFormItem, ImageUpload, LyTree, ccPicker, uniDatetimePicker },
  data () {
    return {
      formData: {},
      securityType: [],
      dangerLevel: [],
      // 公司树
      companyDownTree: [],
      // 指标树
      indexTree: [],
      indexProps: {
        label: 'indexTitle',
      },
      // 指标子项树
      indexTermTree: [],
      indexTermProps: {
        label: 'termTitle',
      },
      // 情况项树
      depindexCutTree: [],
      depindexCutProps: {
        label: 'conditionDes',
      },
      rules: {
        name: [
          { required: true, message: '隐患名称不能空' }
        ]
      }
    }
  },
  onLoad () {
    this._getMyThreeDeptlist()
    this.reset()
  },
  onShow () {
    this.getDicts('security_type').then((response) => {
      this.securityType = response.data
    })
    this.getDicts('danger_level').then((response) => {
      this.dangerLevel = response.data
    })
  },
  methods: {
    // 视频提交
    videoUrlCallBack (data) {
      this.formData.dangerInfo.videoUrls = JSON.stringify(data)
    },
    // 图片回调
    imageUrlCallBack (data) {
      this.formData.dangerInfo.dangerUrls = JSON.stringify(data)
    },
    // 隐患级别选择改变分值
    handleDangerType (data) {
      this.formData.cutScore = data.new_v
    },
    reset () {
      this.formData = {
        assessmentDocId: null,
        cutCompanyId: null,
        cutCompanyName: null,
        indexId: null,
        indexTitle: null,
        termId: null,
        termTitle: null,
        conditionId: null,
        conditionDes: null,
        type: '2',
      }
    },
    // 考核文件 列表
    _selectAssessmendocInfo (companyId) {
      selectAssessmendocInfo({ sign_company_id: companyId }).then(res => {
        if (res?.data?.id) {
          this.formData.assessmentDocId = res.data.id
          this._indexInfoList(res.data.id)
          this.$refs.indexIdPopup.open('bottom')
        }
      })
    },
    // 获取下级公司 列表
    _getMyThreeDeptlist () {
      getMyThreeDeptlist({}).then(res => {
        this.companyDownTree = res.data.treeDept2
      })
    },
    // 打开下级公司弹窗
    _openCompanyDownPopup () {
      this.$refs.companyDownPopup.open('bottom')
    },
    // 选中下级公司节点
    handleCompany (obj) {
      this.formData.cutCompanyId = obj.data.companyId
      this.formData.cutCompanyName = obj.data.label
      this._selectAssessmendocInfo(obj.data.companyId)
      this.$refs.companyDownPopup.close()
    },
    // -------------------------------------------------------
    // 获取指标项 列表
    _indexInfoList (assessmentDocId) {
      indexInfoList({ assessmentDocId: assessmentDocId }).then(res => {
        this.indexTree = res.rows
      })
    },
    // 打开指标弹窗
    _openIndexPopup () {
      this.$refs.indexIdPopup.open('bottom')
    },
    // 选中指标节点
    handleIndex (obj) {
      this.formData.indexId = obj.data.id
      this.formData.indexTitle = obj.data.indexTitle
      this._indexTermList(obj.data.id)
      this.$refs.indexIdPopup.close()
    },
    // -------------------------------------------------------
    // 获取指标子项 列表
    _indexTermList (indexId) {
      indexTermList({ indexId: indexId }).then(res => {
        this.indexTermTree = res.rows
        this._openIndexTermPopup()
      })
    },
    // 打开指标子项弹窗
    _openIndexTermPopup () {
      this.$refs.indexTermPopup.open('bottom')
    },
    // 选中指标节点
    handleIndexTerm (obj) {
      this.formData.termId = obj.data.id
      this.formData.termTitle = obj.data.termTitle
      this._depindexCutList(obj.data.id)
      this.$refs.indexTermPopup.close()
    },
    // -------------------------------------------------------
    // 情况项 列表
    _depindexCutList (termId) {
      depindexCutList({ termId: termId, cutWay: '3' }).then(res => {
        this.depindexCutTree = res.rows
        this._openDepindexCutPopup()
      })
    },
    // 打开指标子项弹窗
    _openDepindexCutPopup () {
      this.$refs.depindexCutPopup.open('bottom')
    },
    // 选中指标节点
    handleDepindexCutTerm (obj) {
      this.formData.conditionId = obj.data.id
      this.formData.conditionDes = obj.data.conditionDes
      this.formData.cutScore = obj.data.cutScore
      this.$refs.depindexCutPopup.close()
    },
    // -------------------------------------------------------
    // 提交
    submit () {
      console.log(this.formData);
      this.$refs.form.validate((response) => {
        if (response) {
          safetyCheckAdd(this.formData).then(res => {
            if (res.code === 200) {
              uni.showToast({
                title: '提交成功',
                icon: 'none',
                duration: 2000,
              })
              setTimeout(() => {
                uni.navigateBack()
              }, 1000);
            } else {
              uni.showToast({
                title: '提交失败',
                icon: 'none',
                duration: 2000,
              })
            }
          })
        }
      })
    }
  },
}
</script>

<style scoped lang="scss">
.safeCheck-edit {
  height: 100%;
  .evan-form {
    overflow: auto;
    padding: 0 40upx;
    margin-top: 0upx;
    background-color: #fff;
    padding-top: 320upx;
  }
  .btn {
    margin-top: 40upx;
    display: flex;
    .submit {
      width: 90%;
      line-height: 80upx;
    }
    .temp-save {
      width: 40%;
      line-height: 80upx;
    }
  }
}
.fileBtn {
  color: #009fdf;
  padding-left: 10upx;
}

/deep/ .ly-tree {
  height: 800upx;
  overflow: auto;
  z-index: 9999;
}
/deep/ .form-input {
  width: 100%;
}
/deep/ .ly-tree-node {
  position: relative;
  white-space: normal;
  padding: 5px 0;
}
/deep/ .ly-tree-node__content {
  height: auto;
}
</style>
